@paprika/stylers
Description
The stylers
package is a companion for the tokens
package, they are both implementations of the Starling Design System for use in styling user interfaces. The stylers
are more than just simple values however, they are helper functions and bundles of CSS rules.
Installation
yarn add @paprika/stylers
or with npm:
npm install @paprika/stylers
Usage
stylers
are intended for use internally and externally.
Internally, when contributors create Paprika components, and externally, when application developers consume Paprika to create user interfaces with the Starling Design System.
Consumers
Typically consumers will be using tokens with Sass. They can be included in any Sass file with:
@import "@paprika/stylers/lib/helpers.scss";
Then you should be able to use Sass functions like font-size()
and spacer()
as well as mixins like @include truncate-text;
and @include focus-ring(true)
.
Contributors
For scalability, in implementation of the stylers
is split into:
includes.js
and formIncludes.js
(for bundles of styling rules)helpers.js
(functions that take an input and generate a value or styling rule/rules).
Links